// 从vuex插件中导入createStore函数
import { createStore } from "vuex";
// 配置vuex的公共数据、公共函数等模块选项
// 配置vuex的5个核心概念
const store = createStore({
    // 存储公共数据的对象，类似于vue里的data
    state:{
        // 人员信息组
        plist:[],

        // 保存注册信息的数组[先注册新账号，后登录新账号]
        user:[]
    },


    // 共同点：mutations和action存储操作函数
    // 区别：mutation存储的同步函数(函数一个个按顺序执行)，只有此处的函数才能直接修改state存储的数据
    mutations:{
        // 添加数据函数:state公共数据，obj组件提交过来的数据
        addlist(state,obj){
            // 将数据提交给state里面的plist完成添加操作
            // JSON.parse(JSON.stringfy(对象)):深拷贝，将括号里面的变量独立成另一个全新的地址
            // 添加之前，先将本次添加的数据独立一个地址，然后再添加
            state.plist.push(JSON.parse(JSON.stringify(obj)));
            alert('添加成功');
        },

        // 删除函数
        dellist(state,i){
            let bool= confirm('是否确认删除当前数据？')
            if(bool){
                state.plist.splice(i,1);
                alert('删除成功');
            }else{
                alert('已取消操作');
            }
            
        },

        // 替换数据
        editlist(state,datas){
            let i=Number(datas.id);
            state.plist[i]=JSON.parse(JSON.stringify(datas.val))
            console.log(datas);
            
            
        }
    },
    // 区别：actions存储的异步函数(同时执行多个函数)，不具备修改state对象的数据，只能作为调用mutations函数的接口
    actions:{
     
    },

    
    // 存储对state的数据加工，类似于computed计算属性（如state存储了时间戳，getter加工成日期格式数据）
    // 不影响原来数据，只是在显示的时候进行优化
    getters:{},

    // 模块，一般用于大型项目的功能划分，登录/注册/忘记密码等与用户信息相关的数据划分一个user模块
    // 每一个独立的模块下，可以重新设置5个核心概念
    modules:{},
})
// 导出
export default store